<template>
  <div class="sourceManage">
    <el-card class="box-card">
      <el-scrollbar wrapClass="scrollbar-wrapper">
        <el-form :inline="true" class="demo-form-inline" size="mini" v-model="queryForm">
          <el-row>
            <el-form-item>
              <el-button size="small" type="primary" icon="el-icon-plus" @click="showFormEvent()">新增任务</el-button>
              <!-- <el-button size="small" type="primary"  @click="showFormEvent()">刷新</el-button> -->
              <!-- <el-button size="small" type="warning"  @click="showFormEvent()">删除</el-button> -->
            </el-form-item>
          </el-row>
          <el-form-item label="任务名称">
            <el-input size="small" v-model="queryForm.jobName" placeholder="任务名称" clearable></el-input>
          </el-form-item>
          <el-form-item label="启用状态">
            <el-select v-model="queryForm.jobState" clearable placeholder="请选择">
              <el-option v-for="item in statusOptions" :key="item.value" :label="item.label" :value="item.value"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="创建时间">
            <el-date-picker v-model="queryForm.createDate" type="date" placeholder="选择日期"></el-date-picker>
          </el-form-item>
          <el-form-item>
            <el-button size="small" type="primary" icon="el-icon-search" @click="searchEvent">搜索</el-button>
          </el-form-item>
        </el-form>
        <znxd-list :column="column" :page="page" :tableData="tableData" @handlePageChange="handlePageChange(page)" :pagination="true"></znxd-list>
      </el-scrollbar>
    </el-card>
    <!-- 表单弹出框 -->
    <fileServerDIalog :databaseFormVisible="databaseFormVisible" :initData="formData" @close="fromClose"></fileServerDIalog>
    <!-- 表单弹出框 -->
  </div>
</template>

<script >
import { list, del, enable, triggerTask } from "@/api/task/fileserver.js"
import { getDiction, formatTime } from "@/utils/config.js"
import fileServerDIalog from "./fileServerDIalog"

export default {
  components: {
    fileServerDIalog
  },
  data() {
    return {
      // 数据库类型字典
      typeOptions: [
        {
          label: "全部",
          value: 0
        },
        {
          label: "sftp服务器",
          value: 1
        },
        {
          label: "ftp服务器",
          value: 2
        }
      ],
      // 状态字典
      statusOptions: [
        {
          label: "启用",
          value: 1
        },
        {
          label: "禁用",
          value: 0
        }
        // {
        //   label: "删除",
        //   value: 0
        // }
      ],
      // 状态字典
      jobExecuteStatusOptions: [
        {
          label: "未执行",
          value: 0
        },
        {
          label: "执行中",
          value: 100
        },
        {
          label: "执行成功",
          value: 200
        },
        {
          label: "执行失败",
          value: 500
        }
      ],
      page: {
        pageNo: 1, // 当前位于哪页
        pageSize: 10, // 1页显示多少条
        total: 0
      },
      // 搜索条件
      queryForm: {},
      tableData: [],
      // 列表配置
      column: [
        {
          align: "center",
          name: "jobName",
          label: "任务名称",
          showOverflowTooltip: true
        },
        {
          align: "left",
          name: "jobDescribe",
          label: "描述",
          showOverflowTooltip: true
        },
        {
          align: "center",
          name: "jobState",
          label: "启用状态",
          width: 80,
          handleGetName: code => {
            return getDiction(this.statusOptions, code)
          }
        },
        {
          align: "center",
          name: "createdate",
          label: "创建时间"
        },
        {
          align: "center",
          name: "latestExecutionTime",
          label: "最近执行时间"
        },
        {
          align: "center",
          name: "jobCron",
          label: "执行周期"
        },
        {
          align: "center",
          name: "nextExecuteTime",
          label: "下次执行时间"
        },
        {
          align: "center",
          name: "jobExecuteStatus",
          label: "任务执行状态",
          width: 80,
          handleGetName: code => {
            return getDiction(this.jobExecuteStatusOptions, code)
          }
        },
        // {
        //   align: "center",
        //   name: "available",
        //   label: "可用",
        //   width: 80,
        //   handleGetName: (code) => {
        //     let str = "";
        //     switch (code) {
        //       case 1:
        //         str = "可用";
        //         break;
        //       case 0:
        //         str = "不可用";
        //         break;
        //     }
        //     return str;
        //   }
        // },
        {
          align: "center",
          label: "操作",
          width: 300,
          buttons: [
            {
              label: "编辑",
              type: "primary",
              plain: false,
              size: "mini",
              handelClick: row => {
                this.showFormEvent(row)
              }
            },
            {
              label: "删除",
              type: "warning",
              plain: false,
              size: "mini",
              handelClick: row => {
                this.deleteEvent(row)
              }
            },
            // {
            //   label: "禁用",
            //   handleGetName: (row) => {
            //     return row.jobState === 1 ? "禁用" : "启用"
            //   },
            //   type: "danger",
            //   handleGetType: (row) => {
            //     return row.jobState === 1 ? "danger" : "success"
            //   },
            //   plain: true,
            //   size: "mini",
            //   handelClick: (row) => {
            //     this.setEvent(row)
            //   }
            // },
            // {
            //   label: "执行",
            //   type: "primary",
            //   plain: false,
            //   size: "mini",
            //   handelClick: (row) => {
            //     this.triggerTask(row)
            //   }
            // },
            {
              label: "配置",
              type: "danger",
              plain: true,
              size: "mini",
              handelClick: row => {
                this.setConfig(row)
              }
            }
          ],
          dropdownButtons: [
            {
              label: "禁用",
              handleGetName: row => {
                return row.jobState === 1 ? "禁用" : "启用"
              },
              type: "danger",
              handleGetType: row => {
                return row.jobState === 1 ? "danger" : "success"
              },
              plain: true,
              size: "mini",
              handelClick: row => {
                this.setEvent(row)
              }
            },
            {
              label: "执行",
              type: "primary",
              plain: false,
              size: "mini",
              handelClick: row => {
                this.triggerTask(row)
              }
            },
            {
              label: "数据同步监控",
              plain: true,
              size: "mini",
              handelClick: row => {
                if (row.jobInfoId === null || row.jobInfoId === 0) {
                  return this.$message({
                    message: "任务未配置，暂时不能查看",
                    type: "error"
                  })
                }
                this.$router.push({
                  path: "monitoringOffLine",
                  query: { jobInfoId: row.jobInfoId, type: 4 }
                })
                console.log(row)
              }
            }
          ]
        }
      ],
      // 表单管理
      databaseFormVisible: false,
      formData: {}
    }
  },
  methods: {
    // 列表操作
    searchEvent() {
      this.page.pageNo = 1
      this.getSourceData()
    },
    getSourceData() {
      let obj = {
        ...this.page,
        ...this.queryForm
      }
      delete obj.total
      if (obj.createDate) {
        obj.createDate = formatTime("yyyy-MM-dd", obj.createDate)
      }
      list(obj).then(res => {
        if (res.data.code === "200") {
          this.tableData = res.data.content
          this.page.total = res.data.total
        } else {
          this.$message({
            message: res.data.msg,
            type: "error"
          })
        }
      })
    },
    handlePageChange(page) {
      this.page = page
      this.getSourceData()
    },
    // form表单弹框操作
    fromClose() {
      this.databaseFormVisible = false
      this.getSourceData()
    },
    showFormEvent(row) {
      this.databaseFormVisible = true
      if (row) {
        this.formData = row
        let { id, jobDescribe, jobName } = row
        this.formData = { id, jobDescribe, jobName }
      } else {
        this.formData = {}
      }
    },
    // 二级操作
    deleteEvent(row) {
      if (row.jobState === 1) {
        this.$message({
          type: "info",
          message: "任务启用，不能删除"
        })
        return
      }

      this.$confirm("确认删除吗?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(() => {
          let obj = {
            id: row.id
          }
          del(obj)
            .then(res => {
              if (res.data.code === 200) {
                this.$message({
                  type: "success",
                  message: res.data.msg || "操作成功"
                })
                this.getSourceData()
              } else {
                this.$message({
                  type: "error",
                  message: res.data.msg
                })
              }
            })
            .catch(() => {
              this.$message({
                type: "error",
                message: "操作失败"
              })
            })
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消删除"
          })
        })
    },
    setConfig(row) {
      this.$router.push({ path: "settingfileServer", query: { id: row.id } })
    },
    setEvent(row, name, value) {
      let obj = {
        id: row.id,
        jobState: row.jobState === 1 ? 0 : 1
      }
      obj[name] = value
      enable(obj)
        .then(res => {
          let data = res.data
          if (data.code === 200) {
            this.$message({
              type: "success",
              message: data.msg || "操作成功"
            })
            this.getSourceData()
          } else {
            this.$message({
              type: "error",
              message: data.msg
            })
          }
        })
        .catch(() => {
          this.$message({
            type: "error",
            message: "操作失败"
          })
        })
    },
    // 执行任务
    triggerTask(row) {
      if (!row.jobState) {
        this.$message({
          type: "error",
          message: "请先启用任务"
        })
        return
      }
      if (!row.jobInfoId) {
        this.$message({
          type: "error",
          message: "请先配置任务"
        })
        return
      }
      let obj = {
        jobId: row.jobInfoId,
        isStart: true
      }
      triggerTask(obj)
        .then(res => {
          let data = res.data
          if (data.code === 200) {
            this.$message({
              type: "success",
              message: data.msg || "操作成功"
            })
            // this.getSourceData()
          } else {
            this.$message({
              type: "error",
              message: data.msg
            })
          }
          this.getSourceData()
        })
        .catch(() => {
          this.$message({
            type: "error",
            message: "操作失败"
          })
        })
    }
  },
  mounted() {
    this.getSourceData()
  }
};
</script>
<style lang="scss" scoped>
@import "../../../assets/style/style.scss";
@import "../../../assets/style/variable.scss";
</style>
